{% extends 'users/user-base.html' %}

{% load static %}
{% block title %}个人中心{% endblock %}
{% block custom_css %}
    <style>
        label{
            margin-top: 7px;
            text-align: right;
        }
        [disabled]{
            text-align: center;
        }
    </style>
{% endblock %}



{% block content %}

    <div class="down-main">
        <div class="left-main left-full">
            <div class="sidebar-fold"><span class="glyphicon glyphicon-menu-hamburger"></span></div>
            <div class="subNavBox">
                <div class="sBox">
                    <div class="subNav sublist-down"><span
                            class="title-icon glyphicon glyphicon-chevron-down"></span><span
                            class="sublist-title">个人中心</span>
                    </div>
                    <ul class="navContent" style="display:block">
                        <li class="active">
                            <div class="showtitle" style="width:100px;">个人中心</div>
                            <a href="{% url 'users:user_info' %}"><span
                                    class="sublist-icon glyphicon glyphicon-cloud"></span><span
                                    class="sub-title">个人资料</span></a>
                        </li>


                    </ul>
                </div>

            </div>
        </div>

        <div class="dashboard-wrapper">
            <div class="dashboard-ecommerce">
                <div class="container-fluid dashboard-content ">
                    <!-- ============================================================== -->
                    <!-- pageheader  -->
                    <!-- ============================================================== -->
                    <div class="row">
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="page-header">
                                <h2 class="pageheader-title">个人资料</h2>
                                <div class="page-breadcrumb">
                                    <nav aria-label="breadcrumb">
                                        <ol class="breadcrumb">
                                            <li class="breadcrumb-item">个人中心</a></li>
                                            <li class="breadcrumb-item active" aria-current="page">个人资料</li>
                                        </ol>
                                    </nav>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- ============================================================== -->
                    <!-- end pageheader  -->
                    <!-- ============================================================== -->

                    <div class="row">
                        <!-- ============================================================== -->
                        <!-- basic table  -->
                        <!-- ============================================================== -->
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="card" style="background-color:#FFFFFF">
                                <div class="card-body">
                                    <div class="form-group row" style="padding-top: 50px;">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">用户名：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="username" value="{{ data.username }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">真实姓名：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="realname" value="{{ data.realname }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">分组信息：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="group" value="{{ data.group }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">注册时间：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="regtime" value="{{ data.regtime }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">登录时间：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="logtime" value="{{ data.logtime }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                        <div class="col-sm-2"></div>
                                        <label class="col-sm-2 col-form-label">电子邮箱：</label>
                                        <div class="col-sm-4">
                                            <div class="custom-file">
                                                <input type="text" class="form-control" disabled="disabled" id="email" value="{{ data.email }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group row text-right">
                                        <div class="col col-sm-10 col-lg-9 offset-sm-1 offset-lg-0" >
                                            <button type="button" class="btn btn-space btn-primary" id="change_info">修改信息</button>
                                            <button type="button" class="btn btn-space btn-success" id="change_pwd" style="margin-right: 70px;">修改密码</button>
                                        </div>
                                    </div>
                                    <p class="text-danger text-center">{{ message }}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content  setborder">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel" style="word-spacing: 3px;">修改个人信息</h4>
                </div>
                <div class="modal-body">

                    <form action="/users/updateUserInfo/" method="POST" id="form-settings" style="margin-left:25px;"
                          enctype="multipart/form-data">
                        <table class="setmar">
                            <tr>
                                <td><span>用户名：</span></td>
                                <td>
                                    <input type="text" class="system setinput item item-info"
                                           data-mtpis='优先使用真实姓名' data-mtpis-style='info' name="username">

                                </td>
                            </tr>
                            <tr>
                                <td><span>原密码：</span></td>
                                <td>
                                    <input type="text" class="system setinput item item-info"
                                           data-mtpis='原先的密码' data-mtpis-style='info' name="old-password">

                                </td>
                            </tr>
                            <tr>
                                <td><span>密码：</span></td>
                                <td>
                                    <input type="text" class="system setinput item item-info"
                                           data-mtpis='优先使用字母加数字' data-mtpis-style='info' name="password">

                                </td>
                            </tr>
                            <tr>
                                <td><span>电子邮箱：</span></td>
                                <td>
                                    <input type="text" class="system setinput item item-info" data-mtpis='请输入使用中的邮箱'
                                           data-mtpis-style='info' name="email">

                                </td>
                            </tr>
                        </table>

                    </form>


                </div>
                <div class="modal-footer">
                    <button type="button" id="submit1" class="btn btn-info" data-dismiss="modal">提交</button>


                </div>
            </div>
        </div>
    </div>

    </div>

{% endblock %}